<template>
  <div>这是home页面 - <button @click="fn">btn</button> - {{ name }}</div>
</template>

<script>
import { computed } from "vue";
import { useRoute } from "vue-router";
import { useStore } from "vuex";
export default {
  setup() {
    // useRouter,useRoute这两个函数只能在setup的顶层执行。
    // useRouter执行的返回值就是路由实例
    // const router = useRouter();

    // route就是页面的路由信息
    const route = useRoute();
    console.log(route);

    // store是仓库实例
    const store = useStore();

    const fn = () => {
      // router.push("/about");
      store.commit("changename");
    };

    const name = computed(() => {
      return store.state.name;
    });

    return {
      fn,
      name,
    };
  },
};
</script>
